<template>
  <el-card class="w-1400px m-auto my-30px px-40px">
    <el-breadcrumb class="mb-30px text-16px">
      <el-breadcrumb-item
        :to="{ path: '/news' }"
        >IP知识库</el-breadcrumb-item
      >
      <el-breadcrumb-item>IP知识库-详情</el-breadcrumb-item>
    </el-breadcrumb>
    <div
      class="flex flex-justify-center flex-items-center text-center line-height-40px px-40px text-30px mb-20px font-600"
    >
      {{ info.title }}
    </div>
    <div class="flex flex-justify-center flex-items-center text-18px mb-10px">
      <div class="mr-30px">发布时间：{{ info.ctime }}</div>
      <div class="mr-30px">来源：{{ info.source }}</div>
      <div class="mr-30px">点击数：{{ info.clicks }}</div>
    </div>
    <div
      v-html="info.content"
      id="wrap"
      class="line-height-30px pb-20px text-16px"
    ></div>
    <!-- <div class="flex">
      <p class="font-600 text-16px">附件：</p>
      <div>
        <div
          v-for="{ name, file_id } in info.files"
          :key="file_id"
          class="text-#1976D2 cursor-pointer mb-10px hover-text-#d1131c text-16px"
          @click="download_file(file_id, name)"
        >
          {{ name }}
        </div>
        <div class="font-600 text-16px" v-if="!info.files?.length">无</div>
      </div>
    </div> -->
  </el-card>
</template>


<script setup lang="ts">
import { ref, reactive } from "vue";
import { useRoute } from "vue-router";
import { news_detail } from "@/api/index";

const $route = useRoute();
const info = ref({});

const get_news_detail = async () => {
  const {
    data
  } = await news_detail({ id: $route.query.id });
  info.value = data;
  console.log('data', data);
};
get_news_detail();
</script>

<style scoped></style>
